<link href="../../static/css/jeDate-test.css" rel="stylesheet" th:href="@{/css/jeDate-test.css}"/>
<link href="../../static/css/jedate.css" rel="stylesheet" th:href="@{/css/jedate.css}"/>
<script src="../../static/js/jquery.jedate.js" th:src="@{/js/jquery.jedate.js}"></script>
<script src="../../static/js/jedate-test.js" th:src="@{/js/jedate-test.js}"></script>
<div class="panel panel-default">
    <!--<div class="panel-heading">-->
    <!---->
    <!--</div>-->
    <div class="panel-body">
        <div class="form-group col-md-12">
            <div class="col-md-2"><h4 class="panel-title">角色管理</h4></div>
            <div class="col-md-10">

                <button type="button" class="btn btn-primary pull-right" data-toggle="modal"
                        data-target=".bs-example-modal-static">添加
                </button>
            </div>
        </div>
    </div>
</div>
<div class="panel panel-default">
    <div class="panel-body">
        <div class="table-responsive">
            <table class="table table-striped table-hover mb30">
                <thead>
                <tr>
                    <th class="column-title">角色名</th>
                    <th class="column-title">当前角色人数</th>
                    <!--<th class="column-title">添加时间</th>-->
                    <th class="column-title">操作</th>
                </tr>
                </thead>
                <tbody>
                <tr th:each="data,iterStat : ${datas.content}">
                    <td th:text="${data.name}">用户名</td>
                    <td th:text="${data.size}"></td>
                    <!--<td th:text="${data.createtime}">添加时间</td>-->

                    <td>
                        <!--<button type="button" th:name="${data.id}"-->
                        <!--class="btn btn-danger" onclick="Reset(this)">重置密码-->
                        <!--</button>&middot;-->
                        <button type="button" th:name="${data.id}"
                                class="btn btn-danger" onclick="dele(this)">删除
                        </button>&middot;
                        <button type="button" th:name="${data.id}"
                                class="btn btn-primary" onclick="edit(this)">修改
                        </button>&middot;
                        <button type="button" th:name="${data.id}"
                                class="btn btn-primary" onclick="openMenu(this)">设置菜单权限
                        </button>
                    </td>
                    <!--<td th:if="${data.username eq 'admin'} or ${data.id eq user.id}">-->
                    <!--<button type="button" th:name="${data.id}" disabled-->
                    <!--class="btn btn-danger" onclick="dele(this)">删除-->
                    <!--</button>&middot;-->
                    <!--<button type="button" th:name="${data.id}" th:if="${data.username eq 'admin'} and ${user.username != 'admin'}" disabled-->
                    <!--class="btn btn-primary"  onclick="edit(this)">修改密码-->
                    <!--</button>-->
                    <!--<button type="button" th:name="${data.id}" th:if="${data.username != 'admin'} "-->
                    <!--class="btn btn-primary"  onclick="edit(this)">修改密码-->
                    <!--</button>-->
                    <!--<button type="button" th:name="${data.id}" th:if="${user.username eq 'admin'} "-->
                    <!--class="btn btn-primary"  onclick="edit(this)">修改密码-->
                    <!--</button>-->
                    <!--</td>-->
                </tr>
                </tbody>
            </table>
            <div id="pagination" class="col-md-12 pagination" th:replace="pagination :: pagination">
            </div>
        </div>
    </div>
</div>


<!--用户管理-添加-->
<div class="modal fade bs-example-modal-static" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"
     data-backdrop="static" aria-hidden="true" style="display: none;" id="user_add">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
                <h4 class="modal-title">角色管理--添加</h4>
            </div>
            <div class="modal-body">
                <form method="post" id="saveUser">
                    <div class="form-group">角色名：</div>
                    <input type="text" class="form-control" style="margin-top: 20px" name="name" id="username_add">
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="saveUser()">保存</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>
<!--用户管理-添加-->

<!--用户管理-修改-->
<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"
     data-backdrop="static" aria-hidden="true" style="display: none;" id="user_edit">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
                <h4 class="modal-title">角色--修改</h4>
            </div>
            <div class="modal-body">
                <form method="post" id="updateuser">
                    <input type="hidden" id="id_update" name="id"/>
                    <div class="form-group">角色名：</div>
                    <input type="text" class="form-control" style="margin-top: 20px" name="name" id="username_update">
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="updateUser()">修改角色名</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>
<!--用户管理-修改-->
<!--用户管理-修改-->
<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"
     data-backdrop="static" aria-hidden="true" style="display: none;" id="menu_edit">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
                <h4 class="modal-title">菜单--修改</h4>
            </div>
            <div class="modal-body" id="menuList" style="min-height: 100px">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="updateUserMenu()">设置菜单</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript" th:inline="javascript">

    var user = [[${user}]];
//    console.log("user", user);
    var  TipUserId ="";
    function openMenu(obj) {
        var id = obj.name
//        console.log(id)
        $.get("role/getMenuById/" + id, function (result) {
//            console.log(result)
            $("#menuList").empty();
            var html = "";
            $.each(result.menu, function (index, item) {
                if (result.menus.indexOf(item.id) == -1) {
                    html += "<div style='width: 100px;float: left;min-height: 40px'><input type='checkbox' name='menus' value='" + item.id + "'><label>" + item.name + "</label> </div> ";
                } else {
                    html += "<div style='width: 100px;float: left;min-height: 40px'><input type='checkbox' name='menus' value='" + item.id + "' checked='true'><label>" + item.name + "</label> </div> ";
                }

            })
            console.log(html);
            $("#menuList").append(html);
        });
        $('#menu_edit').modal('show');
        TipUserId=id;
    }
    function updateUserMenu() {
        var input = $("input:checkbox:checked");
        console.log(input);
        var ids ="";
        $.each(input, function (index, item) {
            ids+=item.defaultValue+",";
        })
        console.log(ids);
        $.get("role/setMenuById/" + TipUserId + "/" + ids, function (result) {
            alert(result.meeage)
            $('#menu_edit').modal('hide');

        });
    }

    function dele(obj) {//删除一条数据：逻辑删除为不可用状态
//        /*[+
        var id = obj.name
//        console.log(id)
        if (window.confirm("执行删除后将无法恢复，确定继续吗？")) {
            $.post("role/roleOnDelete/", {"id": id}, function (result) {
                alert(result.Message);
                $.goTo("role/toRolePage");
            });
        }
        ;
//         +]*/

    }
    function Reset(obj) {//重置一条数据
//        /*[+
        var id = obj.name
//        console.log(id)
        if (window.confirm("执行重置后将无法恢复，确定继续吗？")) {
            $.post("role/userOnReset/", {"id": id}, function (result) {
                alert(result.Message);
                $.goTo("role/toRolePage");
            });
        }
        ;
//         +]*/

    }

    //修改 打开模态框
    function edit(obj) {
        var id = obj.name
        $.get("role/getDateById/" + id, function (result) {
            console.log(result)
            $("#id_update").val(result.user.id);
            $("#username_update").val(result.user.name);
//            $("#password_update").val(result.user.password);
        });
        $('#user_edit').modal('show');
    }
    //修改用户信息
    function updateUser() {
        var updateUser = $("#updateuser").serialize();
        $.post("role/roleOnUpdate", updateUser, function (result) {
            alert(result.Message);
            $("#id_update").val("");
            $("#username_update").val("");
            $("#password_update").val("");
            $.goTo("role/toRolePage");
        });
        $('#user_edit').modal('hide');
    }
    //添加用户信息
    function saveUser() {
        var saveUser = $("#saveUser").serialize();
        $.post("role/roleOnAdd", saveUser, function (result) {
            alert(result.Message);
            $("#username_add").val("");
            $("#password_add").val("123456");
            $.goTo("role/toRolePage");
        });
        $('#user_add').modal('hide');
    }
    function up(number) {//分页跳转，上一页
        /*[+
         var findForm = $("#findForm").serialize();
         var number = parseInt(number);
         $.goTo("role/toRolePage?page="+number,findForm);
         +]*/
    }

    function next(number) {//分页跳转，下一页
        /*[+
         var findForm = $("#findForm").serialize();
         var number = parseInt(number) + 2;
         $.goTo("role/toRolePage?page="+number,findForm);
         +]*/
    }
    function pageTo(page) {
        /*[+
         var number = page;
         var findForm = $("#findForm").serialize();
         $.goTo("role/toRolePage?page=" + number,findForm);
         +]*/

    }

</script>